<template>
  <section class="video-one" id="video">
    <img src="/assets/images/background/video-one-bg.png" alt="Awesome Image" class="video-one__bg"/>
    <div class="container wow fadeInUp" data-wow-duration="1500ms">
      <div class="video-one__box ">
        <img :src="img" alt="">
        <div class="video-one__content">
          <a :href="url" class="video-popup video-one__btn"><i
            class="fa fa-play"></i><!-- /.fa fa-play --></a>
          <!-- /.video-popup -->
          <h2 class="video-one__title">观看我们的<span>教学理念</span><br>视频.</h2><!-- /.video-one__title -->
        </div><!-- /.video-one__content -->
      </div><!-- /.video-one__box -->
    </div><!-- /.container -->
  </section>
</template>

<script>
import apis from '../apis/apis';

export default {
  name: "Video",
  mounted() {

  },
  data() {
    return {
      url: '',
      img: '',
    }
  },
  methods:{
    getValue(){
      apis.getValue("video_photo").then(res => {
        this.img = res.value
      })
      apis.getValue("video").then(res => {
        this.url = res.value
        if ($('.video-popup').length) {
          $('.video-popup').magnificPopup({
            disableOn: 700,
            type: 'iframe',
            mainClass: 'mfp-fade',
            removalDelay: 160,
            preloader: true,
            fixedContentPos: false
          });
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
